import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueJsx from "@vitejs/plugin-vue-jsx"
import { viteExternalsPlugin } from 'vite-plugin-externals'; // cdn引入的外部变量用import引入的名称转化
import inject from '@rollup/plugin-inject'; // 全局变量注入
import UnoCSS from 'unocss/vite'; // 原子css
import path from 'path';
const domain = `http://localhost:5188`;

// https://vitejs.dev/utils/element/
export default defineConfig({
  base: '/page', // 指定顶级路由
  build: { // 打包的路径
    outDir: './dist',
    emptyOutDir: true,
  },
  plugins: [
    vue({
      template: {
        compilerOptions: {
          isCustomElement: (tag) => tag === 'micro-app', // 去除micro-app的警告
        }
      }
    }),
    vueJsx(), // 支持jsx
    viteExternalsPlugin({ // 将element-plus用cdn的形式导入，key为包名，value为全局变量的名称
      'vue': 'Vue', // 相当于 import vue from window.Vue
      'element-plus': 'ElementPlus',
    }),
    inject({ // 全局变量注入
      exclude: [/uni_modules\//, /node_modules\//, /\.css/, /\.less/],
      '_': path.resolve('src/utils/lodash.js'), // 同上
      'moment': path.resolve('src/utils/moment.js'),
      'lc': path.resolve('src/utils/localStorage.js'),
      '_u': [path.resolve('src/utils/unostyle.js'), '_u'],
      '_us': [path.resolve('src/utils/unostyle.js'), '_us'],
      'ref': [path.resolve('src/utils/vueDefine.js'), 'ref'],
      'reactive': [path.resolve('src/utils/vueDefine.js'), 'reactive'],
      'watch': [path.resolve('src/utils/vueDefine.js'), 'watch'],
      'computed': [path.resolve('src/utils/vueDefine.js'), 'computed'],
      'markRaw': [path.resolve('src/utils/vueDefine.js'), 'markRaw'],
      'nextTick': [path.resolve('src/utils/vueDefine.js'), 'nextTick'],
      'onMounted': [path.resolve('src/utils/vueDefine.js'), 'onMounted'],
      'onUnmounted': [path.resolve('src/utils/vueDefine.js'), 'onUnmounted'],
      '$bus': [path.resolve('src/utils/vueDefine.js'), '$bus'],
      '$alert': [path.resolve('src/utils/feedback.js'), '$alert'],
      '$confirm': [path.resolve('src/utils/feedback.js'), '$confirm'],
      '$prompt': [path.resolve('src/utils/feedback.js'), '$prompt'],
      '$success': [path.resolve('src/utils/feedback.js'), '$success'],
      '$error': [path.resolve('src/utils/feedback.js'), '$error'],
    }),
    UnoCSS(), // 原子css
  ],
  resolve: {
    alias: { // 别名
      '@': fileURLToPath(new URL('./src', import.meta.url)), // 就是路径的快捷方式
    },
    extensions: ['.vue', '.js'],
  },
  server: {
    fs: {
      allow: ['..', '.'], // 允许访问工程外的文件
    },
    proxy: { // 添加一个代理服务，解决跨域
      '/api/': domain, // http://127.0.0.1:5173/api/common/getPersonalInfo -> http://127.0.0.1:5188/api/common/getPersonalInfo
    }
  }
})
